"use strict";

/**
 * @auther wtfssd
 * Created by wtfssd on 2017/11/3
 */
import * as React from 'react'

const {View, FlatList} = require('react-native');
const {connect} = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
const {Actions} = require("react-native-router-flux")
import {autoSize, commonProps, commonStyles} from "../../assets/styles/common";
import NavBackButton from "../../component/BackButton";
import MyText from "../../component/MyText";
import Line from "../../component/Line";
import PraiseItem from "../../component/PraiseItem";
import {GroupDetailPage} from "../../interface/router";
const {List} = require('antd-mobile');

class GroupInfoDetailPage extends React.Component<GroupDetailPage, any> {


    onLeaveGroup = () => {
        this.props.dispatch({
            type: 'auth/leaveGroup',
            payload: {groupId: this.props.group.id}
        });


    };

    renderListHeaderComponent = () => {
        return (
            <View style={{paddingVertical: 10}}>
                <List.Item>
                    <MyText>关于</MyText>
                </List.Item>
                <List.Item>
                    <MyText numberOfLines={0}>{this.props.group.description}</MyText>
                </List.Item>
                <List.Item onClick={this.onLeaveGroup}>
                    <MyText>离开</MyText>
                </List.Item>
                <Line height={10} color={'#f4f4f4'}/>
                <List.Item>
                    <MyText>会员</MyText>
                </List.Item>
            </View>
        )
    };

    render() {
        return (
            <View style={commonStyles.container}>
                <NavigationBar {...commonProps.navBar}
                               leftButton={<NavBackButton/>}
                               title={{title: this.props.title, tintColor: '#fff'}}
                />

                <FlatList extraData={this.state}
                          data={[]}
                          keyExtractor={(item, index) => item.id}
                          renderItem={(item) => <PraiseItem style={{backgroundColor: '#fff'}} item={item}/>}
                          ListHeaderComponent={this.renderListHeaderComponent}/>
            </View>
        );
    }
}


export default connect(
    ({auth}) => ({auth})
)(GroupInfoDetailPage);